<ui:composition xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core"
	xmlns:c="http://java.sun.com/jstl/core"
	xmlns:rich="http://richfaces.ajax4jsf.org/rich"
	xmlns:a4j="https://ajax4jsf.dev.java.net/ajax"
	xmlns:t="https://code.google.com/p/rad-framework/taglib"
	xmlns:tt="https://code.google.com/p/rad-framework"
	xmlns:s="http://jboss.com/products/seam/taglib">
	
	<rich:simpleTogglePanel id="conversations" switchType="client"
		label="Conversations" style="width:192px">
		<f:facet name="openMarker">
			<h:graphicImage value="/themes/default/images/rich-panel-header-max.gif"/>
		</f:facet>
		<f:facet name="closeMarker">
			<h:graphicImage value="/themes/default/images/rich-panel-header-min.gif"/>
		</f:facet>
		<ul>
			
			<ui:repeat value="#{conversationList}" var="entry">
				<tt:sidebar-item>
					<a4j:commandLink value="#{entry.description}"
						action="#{entry.select}"/>
				</tt:sidebar-item>
			</ui:repeat>
		</ul>
	</rich:simpleTogglePanel>
	
	<ui:remove>
		<rich:dataTable id="conversationTable" value="#{conversationList}"
			var="entry" rendered="#{not empty conversationList}"
			width="100%">
			
			<f:facet name="header">
				<rich:columnGroup>
					<h:column>Id</h:column>
					<h:column>Workspace</h:column>
					<h:column>Current</h:column>
					<h:column>Nested</h:column>
					<h:column>Activity</h:column>
					<h:column>Initiator</h:column>
					<h:column>View</h:column>
					<h:column>Stack</h:column>
				</rich:columnGroup>
			</f:facet>
			<h:column>
				<h:outputText value="#{entry.id}"/>
			</h:column>
			<h:column>
				<a4j:commandLink action="#{entry.select}"
					value="#{entry.description}"/>
				<a4j:commandLink action="#{entry.destroy}" value="destroy"/>
			</h:column>
			<h:column>
				<h:outputText value="#{entry.current}"/>
			</h:column>
			<h:column>
				<h:outputText value="#{entry.nested}"/>
			</h:column>
			<h:column>
				<h:outputText value="#{entry.startDatetime}">
					<f:convertDateTime type="time" pattern="hh:mm a"/>
				</h:outputText>
				<h:outputText value=" - "/>
				<h:outputText value="#{entry.lastDatetime}">
					<f:convertDateTime type="time" pattern="hh:mm a"/>
				</h:outputText>
			</h:column>
			<h:column>
				<h:outputText value="#{entry.initiatorComponentName}"/>
			</h:column>
			<h:column>
				<h:outputText value="#{entry.viewId}"/>
			</h:column>
			<h:column>
				<h:outputText value="#{entry.conversationIdStack}"/>
			</h:column>
		</rich:dataTable>
						
		<rich:jQuery selector="#conversationTable tr:odd" query="addClass('rad-framework-row-odd')" />
		<rich:jQuery selector="#conversationTable tr:even" query="addClass('rad-framework-row-even')" />
		<rich:jQuery selector="#conversationTable tr" query="mouseover(function(){jQuery(this).addClass('rad-framework-row-over')})"/>
		<rich:jQuery selector="#conversationTable tr" query="mouseout(function(){jQuery(this).removeClass('rad-framework-row-over')})"/>
				
	</ui:remove>
</ui:composition>